<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
		*{
			margin: 0px;
			padding: 0px;
		}
			#top_dj{
				min-width: 1300px;
				height: 100px;
				border-bottom: 2px solid #CC3333;
			}
			#topcenter_dj{
				width: 1172px;
				height: 100px;
				/*border: 1px solid;*/
				margin: 0px auto;
			}
			.shangbiao_dj{
				width: 311px;
				height: 73px;
				/*border: 1px solid;*/
				float: left;
				margin-top: 13px;
			}
			.topwenzi_dj{
				width: 195px;
				height: 18px;
				/*border: 1px solid;*/
				float: right;
				margin-top: 50px;
			}
			.topwenzi_dj span a{
				text-decoration: none;
				font-size: 12px;
				color: #999999;
				margin-left: 15px;
			}
			#cengter_dj{
				width: 880px;
				height: 400px;
				/*border: 1px solid;*/
				margin: 40px auto;
			}
			.cengleft_dj{
				width: 452px;
				height: 260px;
				/*border: 1px solid;*/
				float: left;
				margin-top: 35px;
			}
			.cengright_dj{
				width: 362px;
				height: 390px;
				/*border: 1px solid;*/
				float: right;
			}
			.cengright_dj a,span{
				text-decoration: none;
				font-size: 15px;
				color: #666666;
			}
			.dengluqu_dj{
				width: 363px;
				height: 333px;
				border: 1px solid #CCCCCC;
			}
			.dengluquli_dj{
				width: 347px;
				height: 317px;
				border: 8px solid #EFEFEF;
			}
			.yonghuming_dj{
				margin: 25px 0px 0px 35px;
			}
			.mima_dj{
				margin: 25px 0px 0px 35px;
			}
			.yanzhengma_dj{
				margin: 25px 0px 0px 20px;
			}
			.zidongdenglu_dj li{
				list-style-type: none;
			}
			.zidongdenglu_dj{
				margin: 20px 0px 0px 85px;
			}
			.zidongdenglu_dj label{
				font-size: 15px;
				color: #66667D;
			}
			.wangjimima_dj{
				margin: 15px 0px 0px 85px;
			}
			.forgetPwd{
				margin-left: 15px;
				position: relative;
				top: -10px;
			}
		    .hezuoqu_dj{
		    	width: 290px;
		    	height: 35px;
		    	border-top: 1px solid #EFEFEF;
		    	/*border: 1px solid;*/
		    	margin: 5px 0px 0px 32px;
		    	
		    }
		    .weibo_dj{
		    	display: inline-block;
		    	width: 21px;
		    	height: 21px;
		    	/*border: 1px solid;*/
		    	background-image: url(img/dujun_denglu/d50e308ab6557dead5473e95d8901975.png);
		        background-position: -87px -235px;
		        margin-top: 10px;
		    }
		    .zhifubao_dj{
		    	display: inline-block;
		    	width: 15px;
		    	height: 18px;
		    	/*border: 1px solid;*/
		    	background-image: url(img/dujun_denglu/d50e308ab6557dead5473e95d8901975.png);
		        background-position: -64px -235px;
		    }
		    .weixin_dj{
		    	display: inline-block;
		    	width: 20px;
		    	height: 20px;
		    	/*border: 1px solid;*/
		    	background-image: url(img/dujun_denglu/bfdb5897258b551e046ea2fbc433c70b.png);
		   }
		   .zi_dj{
		   	    font-size: 13px;
		   	    color: #66667D;
		   	    position: relative;
		   	    top: -8px;
		   	    
		   }
		   .hezuoqu_dj span{
		   	    margin-left: 8px;
		   }
		   #bottom_dj{
		   	    width: 575px;
		   	    height: 53px;
		   	   /*border: 1px solid;*/
		   	    margin: 10px auto;
		   }
		   #bottom_dj p{
		   	    font-size: 13px;
		   	    color: #666666;
		   	    text-align: center;
		   }
		   #panduan_dj{
		   	font-size: 12px;
		   }
		   #panduan1_dj{
		   	font-size: 12px;
		   }
		   #denglutu_dj{
		   	width: 180px;
		   	height: 33px;
		   	/*border: 1px solid;*/
		   	margin: 1px 0px 0px 85px;
		   }
		   #denglutu_dj img{
		   	width: 20px;
		   	margin-left: 20px;
		   }
		   #denglutu_dj p{
		   	font-size: 12px;
		   	color: red;
		   	line-height: 15px;
		   }
		</style>
		<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
		<script type="text/javascript" src="js/av-min-2.1.2.js" ></script>
		<script type="text/javascript" src="js/init.js" ></script>
		<script type="text/javascript">
			function yanzheng(){
				var PassWord = document.getElementById('PassWord').value;
				var email = document.getElementById('youxiang_dj').value;
				var panduan_dj = document.getElementById("panduan_dj");
			    var e1 = email.indexOf("@"); //检索邮箱中的@值首次出现的位置，返回坐标
				var e2 = email.lastIndexOf("."); //从后往前检索点，返回第一个
				var e3 = email.indexOf(".", e1); //检索@后边的.的位置
				var biaodashi = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
				if(biaodashi.test(email)) {
					panduan_dj.innerHTML = "邮箱格式正确";
					panduan_dj.style.color="green"
				} else {
					panduan_dj.innerHTML = "邮箱格式不正确";
					panduan_dj.style.color = "red";
				};
			}
//			第一种登录
//          var APP_ID = 'r8DXE8kr6n0dlE7G8mawRv4V-gzGzoHsz';
//			var APP_KEY = 'tltn62F1kT2ziu6yi8Yn9lAy';	
//			AV.init({
//				appId: APP_ID,
//				appKey: APP_KEY
//			});
			
//			function denglu(){		
//				var panduan_dj = document.getElementById("panduan_dj");
//				var panduan1_dj = document.getElementById("panduan1_dj");
//				var email = document.getElementById('youxiang_dj').value;
//				var PassWord = document.getElementById('PassWord').value;
//				if (email=='') {
//					panduan_dj.innerHTML = "邮箱不能为空";
//					panduan_dj.style.color = "red";
//					return false;
//				}else if(PassWord==''){
//					panduan1_dj.innerHTML = "密码不能为空";
//					panduan1_dj.style.color = "red";
//					return false;
//				}else{
//					// LeanCloud - 登录
//                  // https://leancloud.cn/docs/leanstorage_guide-js.html#用户名和密码登录
//                  AV.User.logIn(email, PassWord).then(function (loginedUser) {
//                  // 登录成功，跳转到商品 list 页面
//                  	location.href="index.html"
//                  }, function (error) {
////                      alert(JSON.stringify(error));
//                      alert("登录失败，请重新登录");
//                  });
//				}
//			}


//          REST API 登录
			var t=false;
			function denglu(){
				var panduan_dj = document.getElementById("panduan_dj");
				var panduan1_dj = document.getElementById("panduan1_dj");
				var p = document.getElementById("xianshiqu_dj");
				var email = document.getElementById('youxiang_dj').value;
				var PassWord = document.getElementById('PassWord').value;
				if (email=='') {
					panduan_dj.innerHTML = "邮箱不能为空";
					panduan_dj.style.color = "red";
					return false;
				}else if(PassWord==''){
					panduan1_dj.innerHTML = "密码不能为空";
					panduan1_dj.style.color = "red";
					return false;
				}else{
					if(!t){
						//等待图
						p.innerHTML = '<img src="img/dujun_denglu/c555e723261636447e34e851b35b9e2b.gif"/>';
						$.ajax({
							type: "POST",
							url: "https://api.leancloud.cn/1.1/login",
							data: '{"username":"' + email + '","password":"' + PassWord + '"}',
							contentType: "application/json",
							headers: {
								"X-LC-Id": "BYEEeow0Ql9t5CRVSdo8RhXi-gzGzoHsz",
								"X-LC-Key": "jY0lxpa4tnmROiovzkjtoama"
							},
							success: function(data) {
								console.log(data);
								AV.User.logIn(email, PassWord).then(function(loginedUser) {
									location.href = "index.html"
								}, function(error) {
									alert("连接超时");
								});
							},
					        error: function(data) {
						        console.log(data);
						        t=false;
						        console.log('失败');
						        var json = JSON.parse(data.responseText);
						        p.innerHTML = json.error;
						        return false; 
					        }
				        });
				    t=true;
                    }
				    return false;
			    }
            }
		</script>
	</head>
	<body>
		<div id="top_dj">
			<div id="topcenter_dj">
				<div class="shangbiao_dj">
					<img src="img/dujun_denglu/a09cf0d320e4ffc6445ae0ec42cb02f0.png"/>
				</div>
				<div class="topwenzi_dj">
					<span><a href="denglu_dj.html">请登录</a></span><span><a href="zhuce.html">快速注册</a></span><span><a href="index.html">我的码头</a></span>
				</div>
			</div>
		</div>
		<div id="cengter_dj">
			<div class="cengleft_dj">
				<img src="img/dujun_denglu/5aebbf5a6893bd825441a68a60b42b51.jpg"/>
			</div>
			<div class="cengright_dj">
				<p><span><a href="">账号登陆</a></span><span>|</span><span><a href="">免费注册</a></span></p>
			    <div class="dengluqu_dj">
			    	<div class="dengluquli_dj">
			    		<form onsubmit="return denglu()">
                            <div class="yonghuming_dj">邮箱：<input type="text" placeholder=" 请输入邮箱" onblur="yanzheng()" id="youxiang_dj"><span id="panduan_dj"></span></div>
                            <div class="mima_dj">密码：<input type="password"  id="PassWord"  placeholder=" 请输入密码"><span id="panduan1_dj"></span></div>
                            <div class="yanzhengma_dj">验证码：<input type="text"  style="width: 56px;" placeholder=" 验证码">
                                <img src="img/dujun_denglu/2017-03-13_183254.png" style="vertical-align: middle;"><span>看不清？</span>
                                <a href="" style="color: #3368FF;">换张图</a>
                            </div>
                            <div class="zidongdenglu_dj">
                                <ul>
                                    <li>
                                        <input type="checkbox">&nbsp;<label for="IsRemember" >两周内自动登录</label>
                                    </li>
                                </ul>
                            </div>
                            <div class="wangjimima_dj">
                            	<input type="image" src="img/dujun_denglu/0c514d7e61b7db90f0798895c10e05a9.png" />
                                <span class="forgetPwd"><a href="">忘记密码</a></span>
                            </div>
                        </form> 
                        <div id="denglutu_dj">
                        	<p id="xianshiqu_dj">
                        	</p>
                        </div>
                        <div class="hezuoqu_dj">
			    	        <p><span class="weibo_dj"></span><span class="zi_dj">微博登陆</span><span class="zhifubao_dj" ></span><span class="zi_dj">支付宝登录</span><span class="weixin_dj" ></span><span class="zi_dj">微信登录</span></p>
			    	    </div>
			    	</div>
			    </div>
			</div>
		</div>
		<div id="bottom_dj">
			<p>© 2009－2018 ymatou.com, All rights reserved 增值电信业务经营许可证：沪B2-2014002141 </p>
			<p>上海洋码头网络技术有限公司 版权所有 </p>
			<p>上海市灵石路695号3号楼1404室</p>
		</div>
	</body>
</html>
